<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <style>canvas{width: 100%;height: 100%}</style>
</head>
<body>
<script src="js/three.min.js"></script>
<script>
    var scene = new THREE.Scene();
    //camera = new THREE.OrthographicCamera( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, 1, 1000 );
    var camera = new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,1,1000);
    var renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth,window.innerHeight);
    document.body.appendChild(renderer.domElement);
    var geometry = new THREE.CubeGeometry(1,1,1);
    var material = new THREE.MeshBasicMaterial({color:0xf000ff});
    var cube = new THREE.Mesh(geometry,material);
    scene.add(cube);
    camera.position.z = 2;
    function renders(){
//        requestAnimationFrame(renders);
//        cube.rotation.x +=0.02;
//        cube.rotation.y +=0.01;
        renderer.render(scene,camera);
    }
    renders();
</script>
</body>
</html>